<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Access-Control-Allow-Origin" content="*" />
    <title>统一身份认证管理平台</title>
    <link rel="stylesheet" href="/oauthplatform/static/css/x-admin/font.css">
    <link rel="stylesheet" href="/oauthplatform/static/css/x-admin/login.css">
    <#--        <link rel="stylesheet" href="/oauthplatform/static/css/x-admin/xadmin.css">-->
    <link rel="stylesheet" href="/oauthplatform/static/lib/layui/css/layui.css">
    <style>
        .pro_name a{color: #4183c4;}
        .osc_git_main a{color: #9B9B9B;}
    </style>
</head>

<body>
<div class="layui-container">

    <div class="layui-row header">
        <div class="layui-col-md6 layui-col-md-offset3 header_img">
            <img src="/oauthplatform/static/img/x-admin/logo.png">
        </div>
    </div>

    <div class="layui-row fromCenter">
        <div class="layui-col-md6">
            <img src="/oauthplatform/static/img/x-admin/bg-center.png">
        </div>
        <div class="layui-col-md4 layui-col-md-offset2 login">
            <div class="layui-row formTitle">
                用户登录
            </div>
            <form class="layui-form">
                <input name="username" placeholder="用户名"  type="text" lay-verify="required" class="layui-input" >
                <hr class="hr15">
                <input name="password" lay-verify="required" placeholder="密码"  type="password" class="layui-input">
                <hr class="hr15">
                <div class="layui-form-item">
                    <div id="slider"></div>
                </div>
                <input value="登录" lay-submit lay-filter="login" style="width:100%;" type="submit">
                <#--<button class="layui-btn" type="button" id="reset">重置滑块</button>-->
                <hr class="hr20" >
            </form>
            <#if SPRING_SECURITY_LAST_EXCEPTION??>
                <input type="hidden" id="errorMsg" value="${SPRING_SECURITY_LAST_EXCEPTION.message!''}">
            </#if>
        </div>
    </div>·
    <div class="layui-row footer">
        技术支持：河南现代教育集团出品
    </div>
</div>

<script type="text/javascript" src="/oauthplatform/static/lib/jquery/jquery.3.4.1.js"></script>
<script src="/oauthplatform/static/lib/layui/layui.js" charset="utf-8"></script>
<script>
    $(function () {
        layui.config({
            base: '/oauthplatform/static/lib/verification/'
        }).use(['sliderVerify', 'jquery', 'form'], function(){
            var sliderVerify = layui.sliderVerify, $ = layui.jquery, form = layui.form;
            var slider = sliderVerify.render({
                elem: '#slider',
                onOk: function(){//当验证通过回调
                    layer.msg("滑块验证通过");
                }
            })
            $('#reset').on('click',function(){
                slider.reset();
            })
            $(document).ready(function(){
                var errorMsg = $("#errorMsg").val();
                if(errorMsg != null && errorMsg != ''){
                    layer.msg(errorMsg);
                }
            })
            //监听提交
            form.on('submit(login)', function (data){
                if(slider.isOk()){
                    post("/oauthplatform/login",{username:data.field.username, password:data.field.password});
                }else{
                    layer.msg("请先通过滑块验证");
                }
                return false;
            });
        });
    })

    /*虚拟表单*/
    function post(URL, PARAMS) {
        var temp = document.createElement("form");
        temp.action = URL;
        temp.method = "post";
        temp.style.display = "none";
        for (var x in PARAMS) {
            var opt = document.createElement("textarea");
            opt.name = x;
            opt.value = PARAMS[x];
            temp.appendChild(opt);
        }
        document.body.appendChild(temp);
        temp.submit();
        return temp;
    }
</script>

</body>
</html>